@layer base {

  html,
  body {
    touch-action: manipulation;
    /* overflow-x: hidden; */

    .scroll-bar *::-webkit-scrollbar {
      height: .5rem;
      width: .5rem;
    }

    & ::-webkit-scrollbar {
      width: 4px !important;
    }

    & ::-webkit-scrollbar-thumb {
      background-color: rgb(74, 83, 84) !important;
    }

    .scroll-bar *::-webkit-scrollbar-thumb {
      background-color: #0000004d;
      border-radius: .25rem;
    }

    .scroll-bar *::-webkit-scrollbar-track {
      background: transparent;
    }
  }
  .smooth-scroll {
      --scrollbar-width: 0;
  }

  .button-brand {
    font-weight: 600;
    color: var(--color-black);
    --tg-base-icon-color: var(--color-black);

    .base-icon {
      font-size: 1.125rem;
      margin-right: .375rem;
    }
  }

  .tabs-content {
    /*  background-color: rgb(var(--layer4));
        border-radius: var(--radius-lg);
        margin-top: .5rem; */
    display: flex;
    flex-direction: column;
  }



  .dark {
    .button {
      &:active:not(:disabled) {
        --tw-brightness: brightness(1.05);
      }
    }

    .dark\:bg-white_alpha10 {
      background-color: #ffffff1a;
    }

    .dark\:border-white_alpha5 {
      border-color: #ffffff0d;
    }

    .dark\:bg-layer2 {
      background-color: var(--color-bg-black-2);
    }
  }
}
